<template>
	<view>
		<zy-search :h-list="list" :is-focus="true" :is-block="false" :show-want="true" @search="doSearch"></zy-search>
		<view class="uni-list ">
			<view class="uni-list-cell" hover-class="uni-list-cell-hover"  v-for="(item, index) in result"  :key="index" @click="navToDetailPage(item,'/pages/ask/show')">
				<view class="uni-media-list">
					<view class="uni-media-list-logo" v-if="item.thumb">
						<image :src="item.thumb" mode="aspectFill"></image>
					</view>
					<view class="uni-media-list-body">
						<!-- @click="navToDetailPage(item)" -->
						<view class="uni-media-list-text-top " >{{item.title}}</view>
					</view>
				</view>
			</view>
		</view>
		<uni-load-more :status="loadingType"></uni-load-more>
	</view>
</template>

<script>
	import zySearch from '@/components/zy-search/zy-search.vue';
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	export default {
		components: {
			zySearch,
			uniLoadMore,
		},
		onShow() {
			// 父页面中取出缓存数据传递给组件
			let _this = this;
			try {
				const value = uni.getStorageSync('search_cache');
				if (value) {
					_this.list = value;
				}
			} catch (e) {
				
			}
		},
		//下拉刷新
		onPullDownRefresh(){
			this.page = 1;
			this.loadData('refresh');
		},
		//加载更多
		onReachBottom(){
			if(this.loadingType === 'nomore'){
				return;
			}
			if(this.loadingType === 'loading'){
				return;
			}
			this.page++;
			this.loadData('add');
		},
		data() {
			return {
				count: 15,
				first: 0,
				list:[],
				result: [],
				loadingType: 'more', //加载更多状态
				keywords: '',
				page: 1,
			}
		},
		methods:{
			navToDetailPage(item,url) {
				// let url = this.$api.getPage(item.modelId)+'?id='+item.id;
				if(item.id){
					url += '?id='+item.id;
				}
				uni.navigateTo({
					url: url
				})
			},
			
			//加载，带下拉刷新和上滑加载
			async loadData(type='add', loading) {
				//没有更多直接返回
				if(type === 'add'){
					if(this.loadingType === 'nomore'){
						return;
					}
					this.loadingType = 'loading';
				}else{
					this.loadingType = 'more'
				}
				
					
				let params = {};
				params.page = this.page;
				params.pagesize = 10;
				if(this.keywords){
					params.title = this.keywords;
				}
				
				await this.$http.post('api/article/index',params).then(res=>{
					if(res.code === this.sucCode){
						let result = res.data.list || [];
						if(type === 'refresh'){
							this.result = [];
						}
						this.result = this.result.concat(result);
						
						//判断是否还有下一页，有是more  没有是nomore
						this.loadingType  = result.length < params.pagesize ? 'nomore' : 'more';
						if(type === 'refresh'){
							if(loading == 1){
								uni.hideLoading()
							}else{
								uni.stopPullDownRefresh();
							}
						}
					}else{
						this.$mHelper.toast(res.msg);
					}
					
				}).catch(err=>{
					console.log(err);
				});
				
			},
			
			/* async loadData(type='add', loading, params = {}) {
				if(!this.keywords){
					return ;
				}
				uni.showLoading({
					title:'数据加载中'
				});
				if(type == 'refresh'){
					this.first = 0;
					this.result=[];
				} 
				this.$api.get('search',{q: this.keywords, count: this.count, first: this.first}).then(r =>{
					let list = r.data.body;
					if(list.length != 0){
						this.first = this.first + list.length;
						this.result = this.result.concat(list);
					}
					if(list.length < this.count){//没有其他数据了
						this.loadingType = 'nomore';
						uni.stopPullDownRefresh();//没有跟多数据了
					}
					uni.hideLoading();
				});
			}, */
			doSearch(keywords){
				this.keywords = keywords;
				this.page = 1;
				this.loadData('refresh');
			}
		}
	}
</script>

<style>
	.uni-media-list-body{height:auto}
	.uni-media-list-text-bottom{ text-align: left}
</style>
